﻿.card {
    --bs-card-border-radius: var(--bs-border-radius);
    --bs-card-inner-border-radius: calc(var(--bs-border-radius) - 1px);
    --bb-card-shadow: var(--bb-shadow);
    --bb-card-hover-shadow: var(--bb-hover-shadow);
    --bb-card-collapse-bar-margin-right: .5rem;
    --bb-card-header-tag-height: 21px;
}

.card-header {
    border-bottom-width: 0;
    display: flex;
    align-items: center;
}

    .card-header .card-collapse-arrow {
        margin-right: var(--bb-card-collapse-bar-margin-right);
        transition: transform .3s linear;
    }

    .card-header .card-collapse-bar {
        cursor: pointer;
        margin-right: var(--bb-card-collapse-bar-margin-right);
        flex: 1;
    }

    .card-header .tag {
        line-height: var(--bb-card-header-tag-height);
    }

    .card-header + .card-body {
        border-top: var(--bs-card-border-width) solid var(--bs-card-border-color);
    }

    .card-header .card-title {
        --bs-card-title-spacer-y: 0;
        flex: 1;
    }

.card-shadow {
    box-shadow: var(--bb-card-shadow);
    transition: box-shadow .3s linear;
}

    .card-shadow:hover {
        box-shadow: var(--bb-card-hover-shadow);
    }

[aria-expanded="true"] > .card-collapse-arrow {
    transform: rotate(90deg);
}

.is-collapsable > .card-body {
    padding: 0;
}

    .is-collapsable > .card-body > .card-body-wrapper {
        padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);
    }
